<!--动态表头-->
<template>
  <el-table
      :data="tableData"
      height="400px"
      max-height="400px"
      size="small"
      row-class-name="row"
      cell-class-name="column"
      :row-style="setRowStyle"
      :cell-style="setColumnStyle"
      :highlight-current-row="true"
      @cell-click="cellClick"
      fit
  >
    <el-table-column
        v-for="(item, index) in tableLabel"
        :key="index"
        :prop="item.prop"
        :width="item.width"
        :label="item.label">
    </el-table-column>
  </el-table>

</template>

<script setup>
import {onMounted, ref} from "vue";
import axios from "axios";
const fun1 = async  function (){
 await axios.get("http://localhost:1688/sysUser/allRole").then((data)=>{
    tableData.value =  data.data.data
   console.log(tableLabel.value,"dsd")

    for(let key in tableData.value[0]){
      console.log(key)
      const  tt = {"prop":key,"label":key}
      tableLabel.value.push(tt)
    }

 })
}
onMounted(()=>{
  fun1()

})
const tableData =ref([])
const // 子组件的表头数据
    tableLabel= ref([

    ])

</script>

<style scoped>

</style>